<template>
  <div>
    <div class="form-container">
      <el-form label-position="top">
        <el-form-item label="入库编号">
          <span class="item-value">{{ inDet.ReInNum }}</span>
        </el-form-item>
        <el-form-item label="采血时间">
          <span class="item-value">{{ inDet.blood.createdAt }}</span>
        </el-form-item>
        <el-form-item label="入库时间">
          <span class="item-value">{{ inDet.inDate }}</span>
        </el-form-item>
        <el-form-item label="仓储情况">
          <span class="item-value">{{
            inDet.blood.isRepos === 1 ? "已入库未出库" : "已出库"
          }}</span>
        </el-form-item>
        <el-form-item label="志愿者姓名">
          <span class="item-value">{{ inDet.volunteer.name }}</span>
        </el-form-item>
        <el-form-item label="血型">
          <span class="item-value">{{ inDet.volunteer.bloodType }}</span>
        </el-form-item>
        <el-form-item label="血量">
          <span class="item-value">{{ inDet.blood.bloodVolume }}</span>
        </el-form-item>
        <el-form-item label="保质期">
          <span class="item-value">{{ inDet.blood.shelfLife }}天</span>
        </el-form-item>
        <el-form-item label="保质期至">
          <span class="item-value">{{ inDet.blood.expireDate }}</span>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
import api from './api'
export default {
  props: {
    id: {
      required: false
    }
  },
  data () {
    return {
      inDet: {}
    }
  },
  async mounted () {
    await this.getInDetail()
  },
  methods: {
    async getInDetail () {
      const { data, code, msg } = await api.getInDetail(this.id)
      if (code === 0) {
        this.inDet = data
        console.log(this.inDet)
      } else {
        this.$message.error(msg)
      }
    }
  }
}
</script>
<style scoped lang="scss">
.form-container {
  margin-left: 20px;
}
.item-value {
  margin-left: 20px;
  font-size: 16px;
}
</style>
